<!-- 
 @Author: LW   
 @Date: 2020-12-10 09:05:28   
 @function: 顶部菜单
 -->
<template>
  <div>
    <Header v-bind:isCollapse="isCollapse" @callBack="headerCallBack"></Header>
    <div class="content">
      <Navgation class="leftcontent"  ref="navgationRef"  v-bind:isCollapse="isCollapse"></Navgation>
      <div class="rightcontent" :class="isCollapse ? '' : 'collapsecontent'">
        <div class="formcon">
          <transition name="move" mode="out-in">
            <router-view></router-view>
          </transition>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import homeHttp from "@/api/home/index";
const { loadMenuList } = homeHttp;

import DynamicRoutes from "@/utils/dynamicRoutes";
const { mergeRoutes } = DynamicRoutes;

//引用对象
import Header from "./components/header";
import Navgation from "./components/navgation";
export default {
  name: "home",
  components: { Header, Navgation },
  data() {
    return {
      isCollapse: false //是否收缩
    };
  },
  computed: {},
  /**html加载完成之前，执行。执行顺序：父组件-子组件 */
  created() {},
  /**[页面初始化方法]html加载完成后执行。执行顺序：子组件-父组件 */
  mounted() {
    this.loadMenuList();
  },
  //事件方法执行
  methods: {
    //header回调
    headerCallBack(info) {
      if (info != null) {
        if (info.type == "fold") {
          this.isCollapse = !info.data;
        } else {
          this.$refs.navgationRef.loadSubMenu(info.data);
        }
      }
    },
    //获取菜单
    loadMenuList() {
      let self = this;
      let jsonPar = {
        appSecret: this.$store.getters.appSecret
      };
      loadMenuList(jsonPar).then(response => {
        let data = response.data;
        if (data.Code === 1000) {
          //先循环菜单
          let routesInfo = mergeRoutes(data.Data);
          if (self.$router.options.routes.length <= 4) {
            self.$router.addRoutes(routesInfo);
            self.$router.options.routes.push(routesInfo);
            sessionStorage.setItem("userMenuInfo", encodeURIComponent(JSON.stringify(data.Data)));
          }
        } else {
          this.$messageTip.warning(data.Msg); 
        }
      });
    }
  }
};
</script>

 <style lang="scss" scoped>
@import "../../assets/css/home/index.scss";
</style>